<template>
	<view>
		<view class="top">
			<view class="topView dis dis3" @click="goMaterial">
				<view class="topView_left dis dis2">
					<image :src="imgUrl" mode="scaleToFill" class="uimg"></image>
					<text class="utext" v-if="!isShows">{{name}}</text>
					<button v-if="isShows" type="default" class="share " hover-class='none' open-type="getUserInfo" @getuserinfo="bindGetUserInfo">登录
					</button>
				</view>
				<view class="topView_rigth contenr">
					<image src="../../static/image/ico_5_1.png" mode="aspectFit" class="uimg"></image>
				</view>
				<!-- <view class="topView_rigth contenr" v-if="isLogin"> -->

				<!-- </view> -->
			</view>
		</view>
		<view class="me_conter dis dis2 dis4 ">
			<view class="items dis dis5 dis1 dis2" v-for="(item,index) in list" :key="index" @click="goUrls(item.url)">
				<image :src="item.imgUrl" mode="aspectFit" class="uimg"></image>
				<text class="utex">{{item.text}}</text>
			</view>
		</view>
		<view class="me_botm">
			<block v-for="(item,index) in good" :key="index">
				<view class="item dis dis2 dis3" @click="goUrlGood(item.url)">
					<view class="botm_left dis dis2">{{item.text}}</view>
					<view class="botmRigth dis dis2">
						<image src="../../static/image/ico_5.png" mode="aspectFit" class="ico_5"></image>
					</view>
				</view>
			</block>

		</view>
		<view v-if="loginShow">
			<log @fnnc="fnnc"></log>
		</view>
		<tar-bar :indexTo="3"></tar-bar>
		<!-- <tar-bar :indexTo="2"></tar-bar> -->
	</view>
	</view>
</template>

<script>
	let app = getApp().globalData;
	import tarBar from '@/components/tarbar.vue';
	import log from '@/components/login.vue';
	import pat from '@/common/js/pay.js';
	export default {
		components: {
			'tarBar': tarBar,
			log
		},
		data() {
			return {
				name: '',
				imgUrl: '',
				isShows: false,
				loginShow: false, //弹窗
				list: [{
						imgUrl: '../../static/image/icon_12i.png',
						text: '测评历史',
						url: '/second/me/physicalto/physicalto'
					},
					{
						imgUrl: '../../static/image/ico_3.png',
						text: '健康报告',
						url: '/second/me/physical/physical?index=1'
					},

					{
						imgUrl: '../../static/image/ico_2.png',
						text: '打卡记录',
						url: '/second/yang/clockIn/clockIn'
					}
					// {
					// 	imgUrl: '../../static/img/fankui.png',
					// 	text: '我要反馈',
					// 	url: '/second/me/feedback/feedback'
					// }
				],
				num: 2,
				good: [{
						text: '我要反馈',
						url: '/second/me/feedback/feedback'
					},
					{
						text: '订单记录',
						url: '/second/yang/testerOrder/testerOrder'
					}
				]
			}
		},
		onLoad() {

		},
		onShow() {
			// console.log(app)
			this.getUser()
		},
		methods: {
			// 判断用户是否登录
			getUser() {
				let that = this;
				let userInfo = uni.getStorageSync('userInfo');
				let user = app.user;
				console.log('userInfo',userInfo)
				if (user.avatarurl == '') {
					that.imgUrl = userInfo.avatarUrl;
					that.name = userInfo.nickName;
					that.isShows=false;
					// console.log('ssss')
				} else if (user.avatarurl) {
					that.imgUrl = user.avatarurl;
					that.name = user.nickname;
					that.isShows=false;
					// console.log('sssspp')
				} else if(userInfo){
					that.imgUrl = userInfo.avatarUrl;
					that.name = userInfo.nickName;
					that.isShows=false;
				}else {
					that.imgUrl = '/static/image/ico_4.png';
					that.isShows = true;
					that.name = '游客'
				}

			},

			goMaterial() {
				let that = this
				if (this.isShows) {
					// this.$http.isMssage('请先完成登录再来体验')
					// this.loginShow=true;
					return
				}
				uni.navigateTo({
					url: '/second/me/material/material'
				})
			},
			// 页面跳转
			goUrl() {
				if (this.isShows) {
					// this.$http.isMssage('请先完成登录再来体验')
					this.loginShow = true;
					return
				}
				uni.navigateTo({
					url: '/second/me/feedback/feedback'
				})
			},
			goUrlGood(url) {
				if (this.isShows) {
					// this.$http.isMssage('请先完成登录再来体验')
					this.loginShow = true;
					return
				}
				uni.navigateTo({
					url: url
				})
			},
			// 我 的消息
			goNews() {
				if (this.isShows) {
					// this.$http.isMssage('请先完成登录再来体验')
					this.loginShow = true;
					return
				}
				uni.navigateTo({
					url: '/second/me/news/news'
				})
			},
			// 页面跳转
			goUrls(e) {
				if (this.isShows) {
					this.loginShow = true;
					return
				}
				console.log(e)
				uni.navigateTo({
					url: e
				})
			},
			bindGetUserInfo(e) {
				let that = this;
				pat.register(e).then(res => {
					console.log('res', res)
					app.user = res.data;
					that.isShows = false;
					that.getUser()
				})
				
			},
			fnnc(data) {
				let that = this;
				if (!data.isLogin) {
					that.loginShow = false;
					return
				}
				app.user = data.data;
				that.loginShow = false;
				that.isLogin = false
				that.getUser()
				console.log('data', data)
			}
		},
		onShareAppMessage: function(e) {
			let title = `Young养`
			// let uid = uni.getStorageSync('uid');
			// let reportid = app.reportid;
			return {
				title: title,
				path: `/pages/index/index`
			}
		},
		onShareTimeline: function() {
			let title = `拯救罪恶感，一起朋克养生！`;
			// let uid = uni.getStorageSync('uid');
			// let reportid = app.reportid;
			return {
				title: title,
				path: '/pages/index/index'
			}
		}

	}
</script>

<style lang="scss">
	@import "../../common/css/flex.css";
	@import "../../common/css/index.scss";

	page {
		background: #F8F8F8;
	}

	.top {
		width: 750upx;
		height: 164upx;
		// background-color: #fff;
		// position: relative;

		.topView {
			width: 100%;
			height: 162upx;

			.topView_left {
				min-width: 45%;
				height: 100%;
				margin-left: 32upx;

				.share {
					font-size: 32upx;
					font-family: $typeface;
					font-weight: 500;
					color: #333333;
				}

				.uimg {
					width: 128upx;
					height: 128upx;
					margin-right: 12upx;
					border-radius: 50%;
				}

				.utext {
					font-size: 32upx;
					color: #333;
					font-weight: 500;
					font-family: $typeface;
					margin: 0;
					padding: 0;
					border: none;
				}
			}

			.topView_rigth {
				width: 10%;
				height: 100%;
				margin-right: 16upx;

				.uimg {
					width: 44upx;
					height: 44upx;
				}
			}
		}
	}

	.me_conter {
		width: 686upx;
		height: 210upx;
		background: #FFFFFF;
		border-radius: 24upx;
		margin: auto;
		margin-top: 30upx;

		.items {
			width: 33%;
			height: 100%;

			.uimg {
				width: 56upx;
				height: 56upx;
			}

			.utex {

				font-size: 26upx;
				color: #333333;
				font-family: $typeface;
				font-weight: 500;
				color: rgba(51, 51, 51, 1);
				margin-top: 16rpx;
			}
		}
	}

	.kong {
		width: 750upx;
		height: 120upx;
		// border: 1px solid red;
	}

	.list {
		width: 686upx;
		margin: auto;
		height: 120upx;

		margin-top: 20upx;

		.list_left {
			width: 200upx;
			height: 100%;

			.listText {
				font-size: 32upx;
				font-family: $typeface1;
				font-weight: 400;
				color: rgba(51, 51, 51, 1)
			}

			.unm {
				width: 35upx;
				height: 35upx;
				border-radius: 50%;
				background-color: red;
				color: #fff;
				font-size: 24upx;
				font-family: $typeface;
				font-weight: 500;
			}
		}

		.list_rigth {
			width: 8%;
			height: 100%;

			.imgs {
				width: 44upx;
				height: 44upx;
			}
		}
	}

	.me_botm {
		width: 685upx;
		min-height: 110upx;
		background: #FFFFFF;
		border-radius: 24upx;
		margin: auto;
		margin-top: 32upx;

		.item {
			width: 100%;
			height: 110upx;

			.botm_left {
				font-size: 28upx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #333333;
				margin-left: 32upx;
			}

			.botmRigth {
				width: 36upx;
				height: 36upx;
				margin-right: 32upx;

				.ico_5 {
					width: 36upx;
					height: 36upx;
				}
			}

		}

	}
</style>
